1. 過濾數組 filter

filter()方法返回一個新數組，包含通過callback function測試的所有element。
語法如下:

var newArray = arr.filter(callback(element[, index[, array]])[, thisArg])

thisArg為可選參數，執行callback時，用於指定this的值。

const arr1 = [1, 4, 5, 6, 2, 3, 8, 9, 0];

const arr2 = arr1.filter((item, index, array) => {
  return item > 5;
});
console.log(arr2);//>> [6, 8, 9]

callback函數只要return true就會保留當前的element。

2. 查找方法 find

find()方法會返回通過callback function測試的第一個值，如果沒有就返回undefined。

語法如下:

var item = arr.find(callback(element[, index[, array]])[, thisArg])

let arr = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9];
const value = arr.find((item, index, array) => {
    return item > 5
});
console.log(value); //>> 6

與find類似的方法是findIndex()，區別在於find返回值，而findIndex返回index，如果沒有就返回-1。

3. some

some()方法測試數組中是不是有任何一個element通過測試，如果有的話返回true。

語法如下:

arr.some(callback(element[, index[, array]])[, thisArg])

如果對空array進行測試，任何狀況下都是返回fasle。

let arr = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9];
const isTrue = arr.some((item, index, array) => {
  return item > 5;
});
console.log(isTrue); //>> true

與filter和find相比，除了返回值有區別外，還有一個區別是:如果原數組中存在被刪除或是沒有被賦值的索引，則callback function不會在該element上調用。

const arr = new Array(4);
arr[0] = 1;
const isTrue = arr.some((item,index) => {
    console.log(`test ${index}`)
    return item > 5;
});
console.log(isTrue); //>> false

上面的例子只有在index = 0的element callback有調用。

4. sort

語法:

var newArray = arr.sort([compareFunction]);

參數:

compareFunction: 可選，指定一個函式來定義排序順序。假如省略此參數，陣列將根據各個元素轉為字串後的每一個字元之 Unicode 編碼位置值進行排序。

let arr = [1, 4, 5, 6, 2, 3, 8, 9, 0];
arr.sort((a, b) => {
  return a - b;
});
console.log(arr);
//>> [0, 1, 2, 3, 4, 5, 6, 8, 9]

sort()的compare function接收兩個參數，這兩個參數會按照function的返回值進行排序:

• 如果返回值小於0，a會排在b前面
• 如果返回值大於0，a會排在b後面
• 如果相等，則a與b的相對位置不變

let arr = [2, 40, 11, 5, 10];
console.log(arr.sort());
//>> [10, 11, 2, 40, 5]

上述例子中，因為沒有傳入callback function，所以在Unicode中，1在2前面，所以10在2前面，以此類推。

5. reduce

reduce()方法對數組中的每一項執行所提供的call back function後，最後回傳一個單個值。

語法:

arr.reduce(callback(accumulator, currentValue[, index[, array]])[, initialValue])

參數說明:

1. accumulator : 等於上一次call back function的返回值，或是initialValue。
2. currentValue : 數組中正在處理的element。
3. currentIndex : 可選，當前正在處理的element的index，如果提供了initialValue，則index從0開始，否則從1開始。
4. array : 可選，調用reduce的數組。
5. initailValue : 可選，如果沒有提供初始值，則將使用數組的第一個element(也就是針對數組的循環少一次，從index 1 開始做循環)，如果沒有初始值的空數組會報錯。

reduce的定義比較抽象，開發中比較少用到，但若是用的好可以大大提升工作效率，以下提供一個簡單的例子。

擁有一個已下數組:

const arr  = [
    {
        username:    'John',
        displayname: 'John',
        email:       'john123@gmail.com'
    },
    {
        username:    'David',
        displayname: 'David',
        email:       'david123@gmail.com'
    },
    {
        username:    'Sarah',
        displayname: 'Sarah',
        email:       null
    },
];

透過reduce轉換為object

function callback(acc, person){
    return {...acc,[person.username] : person}
}

const obj = arr.reduce(callback, {})

console.log(obj)

// 
David: {username: "David", displayname: "David", email: "david123@gmail.com"}
John: {username: "John", displayname: "John", email: "john123@gmail.com"}
Sarah: {username: "Sarah", displayname: "Sarah", email: null}